page,
.content {
	background: $uni-bg-color-grey;
	height: 100%;
}

.swiper-box {
	height: calc(100% - 40px);
}

.list-scroll-content {
	height: 100%;
}

.navbar {
	display: flex;
	height: 40px;
	padding: 0 5px;
	background: #fff;
	box-shadow: 0 1px 5px rgba(0, 0, 0, .06);
	position: relative;
	z-index: 10;

	.nav-item {
		flex: 1;
		display: flex;
		justify-content: center;
		align-items: center;
		height: 100%;
		font-size: 15px;
		color: $uni-text-color-dark;
		position: relative;

		&.current {
			color: $uni-text-color;

			&:after {
				content: '';
				position: absolute;
				left: 50%;
				bottom: 0;
				transform: translateX(-50%);
				width: 44px;
				height: 0;
				border-bottom: 2px solid $uni-bg-color-pink;
			}
		}
	}
}

.uni-swiper-item {
	height: auto;
}

.order-item {
	display: flex;
	flex-direction: column;
	padding-left: 30upx;
	background: #fff;
	margin-top: 16upx;

	.i-top {
		display: flex;
		align-items: center;
		height: 80upx;
		padding-right: 30upx;
		font-size: $uni-font-size-base;
		color: $uni-text-color-dark;
		position: relative;

		.time {
			flex: 1;
		}

		.state {
			color: $uni-text-color;
		}

		.del-btn {
			padding: 10upx 0 10upx 36upx;
			font-size: $uni-img-size-base;
			color: $uni-text-color-dark;
			position: relative;

			&:after {
				content: '';
				width: 0;
				height: 30upx;
				border-left: 1px solid $uni-border-color;
				position: absolute;
				left: 20upx;
				top: 50%;
				transform: translateY(-50%);
			}
		}
	}
	
	.product-list {
		display: flex;
		padding: 20upx 0;
	}
	
	.price-box {
		display: flex;
		justify-content: flex-end;
		align-items: baseline;
		padding: 20upx 30upx;
		font-size: $uni-font-size-sm;
		color: $uni-text-color-light;

		.num {
			margin: 0 8upx;
			color: $uni-text-color-dark;
		}

		.price {
			font-size: $uni-font-size-lg;
			color: $uni-text-color-red;

			&:before {
				content: '￥';
				font-size: $uni-font-size-base;
				margin: 0 2upx 0 8upx;
			}
		}
	}

	.action-box {
		display: flex;
		justify-content: flex-end;
		align-items: center;
		height: 100upx;
		position: relative;
		padding-right: 30upx;
	}

	.action-btn {
		width: 160upx;
		height: 60upx;
		margin: 0;
		margin-left: 24upx;
		padding: 0;
		text-align: center;
		line-height: 60upx;
		font-size: $uni-font-size-sm;
		color: $uni-text-color-dark;
		background: #fff;
		border-radius: 100px;

		&:after {
			border-radius: 100px;
		}

		&.recom {
			background: $uni-color-primary;
			color: $uni-text-color-inverse;

			&:after {
				border-color: #f7bcc8;
			}
		}
	}
}
